<template>
    <div class="container">
        <h3>养护信息</h3>
        <el-form :model="ruleForm" ref="ruleForm" :rules="rules" :label-position="labelPosition" label-width="150px" class="demo-ruleForm">
  
            <el-row>
                <el-col :span="10">
                    <el-form-item label="基源名称：">
                        <el-select v-model="ruleForm.name"  value-key="id" filterable placeholder="请选择" style="width: 300px;">
                                <el-option
                                    v-for="item in basesourcelist"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.name"
                                >
                                {{item.name}}
                                </el-option>
                            </el-select>
                    </el-form-item>
                    <el-form-item label="养护工艺名称：">
                        <el-input placeholder="请输入" v-model="ruleForm.technology" style="width:300px"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
             <el-table
                :data="ruleForm.curingList"
                style="width: 100%">
                <el-table-column
                    prop="content"
                    label="养护检查内容"
                    >
					<!-- <el-input v-model></el-input> -->
					<template slot-scope="scope">
						<el-input v-model="scope.row.content" style="width:300px"></el-input>
					</template>
                </el-table-column>
                <el-table-column
                    prop="standard"
                    label="养护标准/方法"
                    >
					<template slot-scope="scope">
						<el-input v-model="scope.row.standard" style="width:300px"></el-input>
					</template>
                </el-table-column>
                <el-table-column
					width="120"
                    label="操作">
                    <template slot-scope="scope">
                        <el-button type="text">删除</el-button>
                    </template>
                </el-table-column>
            </el-table> 
			<el-col class="add" @click.native="add">+添加一条</el-col>
            <el-form-item class="footerFixed" label-width="0px">
                <el-button type="primary" @click="submitrule('ruleForm')">提交</el-button>
                <el-button @click="backPage">返回</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
    import {basesource_findByAll,curing_save,curing_findById,curing_update} from "@/request/api"
    export default {
        data(){
            return{
                ruleForm:{
					name:'',
					technology:'',
                    curingList:[
                        {content:'',standard:''}
                    ]
                },
                labelPosition:"right",
                rules:{},
                basesourcelist:[],
				id:''
            }
        },
        mounted(){
			this.id = this.$route.query.id
			if(this.id != undefined){
				this.init()
			}
            this.getbasesource()
        },
        methods:{
			init(){
				curing_findById(this.id).then((res)=>{
					this.ruleForm = res.data
				})
			},
			add(){
				this.ruleForm.curingList.push({content:'',standard:''})
			},
            getbasesource(){
                basesource_findByAll("").then((res)=>{
                    this.basesourcelist = res.data
                })
            },
            submitrule(){
				if(this.id == undefined){
					curing_save(this.ruleForm).then((res)=>{
						this.$notify({
							title: '提示',
							message: '保存成功',
							type: 'success',
							duration: 1000
						});
						this.$router.go(-1);
					})
				}else{
					curing_update(this.ruleForm).then((res)=>{
						this.$notify({
							title: '提示',
							message: '修改成功',
							type: 'success',
							duration: 1000
						});
						this.$router.go(-1);
					})
				}
               
            },
            backPage(){
                this.$router.go(-1)
            }
        }
    }
</script>

<style scoped>
.add{
    background-color: rgba(235, 245, 255, 1);
    border: 1px dotted lightgray;
    color: #333;
    margin: 10px 0 0 0;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
  }
</style>
